@import "./_function";
@import "./_variables";

@mixin text-ellipsis {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

@mixin bottom-line {
	&:after {
		content: '';
		display: block;
		height: pr(30);
		background: $bgColor;
	}
}

@mixin default-avatar {
	img {
		width: 100%;
		height: 100%;
		& + span {
			display: none;
		}
		&[src=''], &:not([src]) {
			display: none;
		}
		&[src=''] + span, &:not([src]) + span {
			display: inline-block;
			width: 100%;
			height: 100%;
			font-size: pr(150);
			background: $bgColor;
		}
	}
}

@mixin paymentStyle($color) {
	display: flex;
	align-items: center;
	padding: 0 pr(40);
	height: pr(230);
	border-top: 1px solid $borderColor;
	border-bottom: pr(15) solid #fbfbfb;
	&-icon {
		margin-right: pr(45);
		.iconfont {
			font-size: pr(75);
			color: $color;
		}
	}
	&-detail {
		&-price {
			margin-bottom: pr(40);
			span {
				&:nth-child(1) {
					font-size: pr(40);
				}
				&:nth-child(2) {
					font-size: pr(35);
					color: $priceColor;
				}
			}
		}
		&-number {
			font-size: pr(30);
			color: #999;
		}
	}
}
